<html lang="en" xml:lang="en"><head>
<META http-equiv="Content-Type" content="text/html">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><META name="description" content="Naming conventions"><meta name="content-language" content="en"><link href="rsrc/htmlhelp.css" rel="stylesheet" type="text/css"><title>Web AppBuilder for ArcGIS | Help - 
Naming conventions
</title>
                <script type="text/javascript" language="JavaScript">
                    var pathL  = self.location.pathname.split ("/");
                    var fname = pathL[pathL.length-1];
                    var i = fname.lastIndexOf (".htm");
                    if (i>=0) {
                    fname = fname.substring (0, i)
                    } else {
                    //??
                    }
                    if (self.location.hash) {
				    		      fname = fname + self.location.hash;
						        }
                    self.location.replace ("../index.html#//" + fname);
                </script>
                </head><!--Publication GUID: [GUID-E7D1C130-8F87-4109-8D61-E73A46083F52]--><!--Topic GUID: [GUID-569693C3-716A-4F4A-8ED2-F7BDF729D71D]--><body><div id="content"><div class="header"><h1>
Naming conventions
</h1><div id="breadcrumb"></div></div>
<p id="GUID-AC3BE593-A2C2-43D0-B085-748C74C9FF16">The widget development section will walk you through the steps to create a widget. You can preview the demo widget <a target="_blank" class="xref" rel="http://www.arcgis.com/apps/webappviewer/index.html?config=sample-configs/config-demo.json" href="http://www.arcgis.com/apps/webappviewer/index.html?config=sample-configs/config-demo.json">live</a>. Click the first widget icon on the upper right area after the app starts.</p><p id="GUID-5D16A494-381C-4226-BBBA-29559F3297AF">
Although a widget’s resources can be named differently, the following are recommended:
</p>
<p id="GUID-02CBA4F6-ED2C-4F44-833C-3DB6725AC349"><div class="block_table" id="TABLE_F1CBE2273E6F4005BF63C1BCB77A7EEB" purpose="block_table"><span class="table_title"></span><table class="table"><colgroup width="*"></colgroup><colgroup width="*"></colgroup><tr purpose="thead"><th class="th" purpose="th" rowspan="1" colspan="1"><p id="GUID-7328349F-B58A-46CB-963A-C2679D4F042B">Name</p></th><th class="th" purpose="th" rowspan="1" colspan="1"><p id="GUID-72E1D4FE-C9A7-4C8B-ADD9-3F619533BA2E">Description</p></th></tr><tbody><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-A42C0AE8-974F-49AD-B09E-32375DA777E2"><span class="usertext">Widget class</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-2939E6E5-4A8B-4AB6-8C27-050513E0C828">Uses the convention name, Widget.js.</p></td></tr><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-A870FFFF-2E2B-4E3D-8F3B-D523C23C8B8C"><span class="usertext">Widget template (widget UI)</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-F62CE278-49D0-44AD-9AC2-8DFA726CD78B"> Uses the same name as the widget class except with a .html extension. For example, Widget.html.</p></td></tr><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-EE7FD260-F52D-4723-9072-5BABB6421968"><span class="usertext">Widget configuration file</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-E8FB999C-5A59-4C34-9140-C57808B0E6EC">Uses the config.json file and puts it into the widget folder.</p></td></tr><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-131D7BBC-1C79-4A86-AE8E-19FE1B5BD499"><span class="usertext">Widget I18N file (locale file)</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-790B51E9-C347-4C08-8F60-4FF6FE7D3E80">Uses the strings.js file and puts it into the nls folder. For more information, see Dojo’s documentation at <a target="_blank" class="xref" href="http://dojotoolkit.org/documentation/tutorials/1.8/i18n/" rel="http://dojotoolkit.org/documentation/tutorials/1.8/i18n/">http://dojotoolkit.org/documentation/tutorials/1.8/i18n/</a>.</p></td></tr><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-F2853FAD-100A-43F7-9CDD-D2EB92FD616F"><span class="usertext">Widget style file</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-A273DF8C-7888-484B-A95C-BB9DC972A276">Uses the style.css file and puts it into the css folder. Puts all the images used by the style into the images css subfolder.</p></td></tr><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-924BB602-8684-4656-97A1-F06F3E4E3C15"><span class="usertext">Widget icon files</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-1A56F646-4C79-492A-8D58-0EA97BBA1196">Uses the icon.png file name and puts it into the images folder.</p></td></tr><tr><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-DA022C82-FB28-4568-BDCF-131268EA109F"><span class="usertext">Widget manifest file</span></p></td><td purpose="entry" rowspan="1" colspan="1"><p id="GUID-049EF81C-4AE3-4056-A9DC-4BB5084F4CA7">Uses the name manifest.json to describe the widget’s content.</p>
</td></tr></tbody></table><span class="table_desc"></span></div></p>

<div class="footer"> Copyright © 1995-2016 Esri. All rights reserved. </div></div></body></html>